body {
  /*
  background-color: #f8f8f8;
   */
  color: #212529;
}

input {
  min-width: 400px;
}

.default-notice {
  color: #30ba78;
}

.list-group {
  margin-left: 3rem;
  margin-right: 2rem;
}
ul {
  display: flex;
  flex-direction: column;
  padding-left: 0;
  margin-bottom: 0;
  border-radius: 0.25rem;
}
.default-redirect-domains li {
  list-style: none !important;
}
li {
  list-style: decimal;
  font-size: 1.2rem;
  padding: 0.5rem 1rem;
  color: #212529;
  text-decoration: none;
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, 0.125);
}
li:active {
  z-index: 2;
  color: #fff;
  background-color: #0d6efd;
  border-color: #0d6efd;
}
li:hover {
  color: #495057;
  text-decoration: none;
  background-color: #f8f9fa;
}
textarea:focus {
  color: #212529;
  background-color: #fff;
  border-color: #86b7fe;
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgb(13 110 253 / 25%);
}
textarea {
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  appearance: none;
  border-radius: 0.25rem;
  transition:
    border-color 0.15s ease-in-out,
    box-shadow 0.15s ease-in-out;
}
.box {
  padding: 1.5rem;
  margin-right: 0;
  margin-left: 0;
  border-width: 1px;
  border-top-left-radius: 0.25rem;
  border-top-right-radius: 0.25rem;

  border-radius: 6px;
  color: rgba(0, 0, 0, 0.87);
  background: #fff;
  /*
  background-color: rgb(33,37,41);

   */
  box-shadow:
    0 2px 2px 0 rgb(0 0 0 / 14%),
    0 3px 1px -2px rgb(0 0 0 / 20%),
    0 1px 5px 0 rgb(0 0 0 / 12%);
}
button:active:focus {
  box-shadow: 0 0 0 0.25rem rgb(49 132 253 / 50%);
}
button:hover {
  background-color: #0b5ed7;
  border-color: #0a58ca;
}
button {
  color: #fff;
  background-color: #0d6efd;
  border-color: #0d6efd;
  border: 1px solid transparent;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  border-radius: 0.25rem;
  transition:
    color 0.15s ease-in-out,
    background-color 0.15s ease-in-out,
    border-color 0.15s ease-in-out,
    box-shadow 0.15s ease-in-out;
}

.goto-sync-remote-rule,
.add-rule,
.add-special-rule,
.update-rule {
  background-color: #50cd89;
  border-color: #50cd89;
}

.goto-sync-remote-rule:hover,
.add-rule:hover,
.add-special-rule:hover,
.update-rule:hover {
  background-color: #73d7a1;
  border-color: #73d7a1;
}
.delete-all-dynamic-rule,
.delete-sync-remote-rule,
.delete-self-define-rule,
.delete-self-define-special-rule {
  background-color: #f1416c;
  border-color: #f1416c;
}

.backup-all-dynamic-rule,
.back-new-rule-to-json {
  background-color: #009ef7;
  border-color: #009ef7;
}

.reset_default_domain {
  background-color: rgba(114, 57, 234, 0.85);
  border-color: rgba(114, 57, 234, 0.85);
}

iframe {
  border: none;
}

.rule_dynamic_set_list li:hover,
.rule_static_set_list li:hover {
  color: #c5955d;
  /*
font-size: 1.3rem;
*/
}
.dynamic-rule-list-note {
  margin-left: 2rem;
}
.del-flag {
  color: red !important;
  font-size: 1.2rem;
  line-height: 1.2rem;
  font-weight: 800;
}

/*
#jsoneditor {
  width: 600px;
  height: 500px;
}

 */

.placeholder-box {
  display: inline-block;
  margin-left: 2rem;
}

.example-hidden {
  display: none;
}

.show-rule-info-box-no-use {
  /*
  position: relative;
  top:-540px;
  top:-30px;
  */
  position: absolute;

  top: 1750px;
  z-index: 100;
  left: 200px;
}
.show-rule-info-box-extra {
  top: 2020px;
}

.form-select {
  display: block;
  width: 100%;
  padding: 0.375rem 2.25rem 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-repeat: no-repeat;

  background-position: right 0.75rem center;
  background-size: 16px 12px;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  transition:
    border-color 0.15s ease-in-out,
    box-shadow 0.15s ease-in-out;
  appearance: none;
}

.notice,
.warning {
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: red;
}

/*
   配色参考：
   https://c.runoob.com/more/colorpad/tradcnc.html
   https://chromiumdash.appspot.com/schedule
 */

.single_rule {
  /*
  background-color: #732e7e;
   */
  background-color: rgba(62, 151, 255, 0.85);
}

.self_define_special_rule {
  /*
  background-color: #808883;

   */
  background-color: rgba(241, 65, 108, 0.85);
}

.self_define_rule {
  /*
  background-color: #9db1a0;
  background-color: #4c8bf5;
   */
  background-color: rgba(80, 205, 137, 0.85);
}

.sync_remote_static_rule {
  background-color: rgba(255, 199, 0, 0.85);
}

.sync_remote_rule {
  background-color: rgba(114, 57, 234, 0.85);
}

.all_dynamic_rule {
  background-color: rgba(80, 205, 205, 0.85);
}

.all_dynamic_rule_test {
  /*
  background-color: #eee;
  background-color: #1a638a;
  background-color: #10da5a;
  background-color: #04a4ff;
  background-color: #027a7a;
  background-color: #9c27b0;
  background-color: #8b8bdd;
  background-color: #efefef;
  background-color: #bd7a07;
*/
  background-color: rgba(63, 66, 84, 0.85);
}
